<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><![endif]-->
        
        <title>hnust_LiuXingLong Web site</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">
        
        <!-- Google Web Font Embed -->
        
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/font-awesome.min.css">
        <link rel="stylesheet" href="css/templatemo_main.css">
    </head>
    <body>
        <div id="main-wrapper">
            <!--[if lt IE 7]>
                <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="#/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
            <![endif]-->

            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-center templatemo-logo margin-top-20">
                <h1 class="templatemo-site-title">
                    <a href="#">hnust_LiuXingLong</a>
                </h1>
                <h3 class="templatemo-site-title">
                	Web <a href="#"><span class="blue">Site</span></a>
                </h3>
            </div>

            <div class="image-section">
                <div class="image-container">
                    <img src="images/zoom-bg-1.jpg" id="menu-img" class="main-img inactive" alt="Zoom HTML5 Template by templatemo.com">
                    <img src="images/zoom-bg-2.jpg" id="products-img" class="inactive" alt="Product">
                    <img src="images/zoom-bg-3.jpg" id="services-img"  class="inactive" alt="Services">
                    <img src="images/zoom-bg-4.jpg" id="about-img" class="inactive" alt="About">
                    <img src="images/zoom-bg-5.jpg" id="contact-img" class="inactive" alt="Contact">
                    <img src="images/zoom-bg-6.jpg" id="company-intro-img" class="main-img inactive" alt="Company Intro">
                    <img src="images/zoom-bg-7.jpg" id="testimonials-img" class="main-img inactive" alt="Testimonials">
                </div>
            </div>
          
            <div class="container">
                <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 col-md-offset-2 col-lg-offset-2 templatemo-content-wrapper">
                    <div class="templatemo-content">
                        
                        <section id="menu-section" class="active">
                            <div class="row">
                                <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3 margin-bottom-20">
                                    <a href="#products" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <i class="fa fa-cubes"></i>
                                            <h2>Products</h2>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3 margin-bottom-20">
                                    <a href="#services" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <i class="fa fa-laptop"></i>
                                            <h2>Services</h2>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3 margin-bottom-20">
                                    <a href="#about" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <i class="fa fa-users"></i>
                                            <h2>About</h2>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-xs-6 col-sm-3 col-md-3 col-lg-3 margin-bottom-20">
                                    <a href="#contact" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <i class="fa fa-envelope"></i>
                                            <h2>Contact</h2>
                                        </div>
                                    </a>
                                </div>
                            
                                <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 margin-bottom-20">
                                    <a href="#company-intro" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <h2>Introduction to Company</h2>
                                        </div>
                                    </a>
                                </div>
                                <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 margin-bottom-20">
                                    <a href="#testimonials" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <h2>Testimonials and Awards</h2>
                                        </div>
                                    </a>
                                </div>
                              
                            </div>
                        </section><!-- /.menu-section -->   
						

                        <section id="products-section" class="inactive">
                            <div class="row">
                                <div class="col-sm-6 col-md-6 col-lg-6 margin-bottom-20">
                                    <div class="black-bg col-sm-12 col-md-12 col-lg-12">
                                        <h2>WEB DESIGN</h2>
                                        <p><a rel="nofollow" href="http://liuxinglong.github.io/Blog/">hnust_LiuXingLong</a>
										<a rel="nofollow" href="#"></a></p>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-6 col-lg-6">
                                    <div class="black-bg col-sm-12 col-md-12 col-lg-12">
                                        <h2>RESPONSIVE</h2>
                                        <p><span class="green">http://liuxinglong.github.io/Blog/</span></p>
                                    </div>
                                </div>
                            </div>
                            <div class="row margin-top-20">
                                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  pull-right">
									<a href="#menu" class="change-section">                             
	                                      <div class="black-bg btn-menu">
                                            <a href="http://liuxinglong.github.io/Blog/">Back to menu</a>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </section><!-- /.product-section -->  
						
                        <section id="services-section" class="inactive">
                            <div class="row">
                                <div class="col-sm-12 col-md-12 col-lg-12">
                                    <div class="col-sm-12 col-md-12 col-lg-12 black-bg">
                                        <h2>OUR SERVICES</h2>
                                        <p><a href="#"></a></p>
                                        <p></p>
                                    </div>
                                </div>
                            </div>
                            <div class="row margin-top-20">
                                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  pull-right">
                                    <a href="#menu" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <a  href="http://liuxinglong.github.io/Blog/">Back to menu</a>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </section><!-- /.services-section -->   
						
                        <section id="about-section" class="inactive">
                            <div class="row">
                                <div class="black-bg col-sm-12 col-md-12 col-lg-12">
                                    <h2 class="text-center">About Us</h2>
                                    <div class="col-sm-6 col-md-6">
                                        <p><a href="#"></a></p>
                                    </div>
                                    <div class="col-sm-6 col-md-6">
                                        <p></p>
                                    </div>
                                </div>
                            </div>
                            <div class="row margin-top-20">
                                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  pull-right">

                                    <a href="http://liuxinglong.github.io/Blog/" class="change-section">  <!--   href="#menu" -->
                                        <div class="black-bg btn-menu">
                                           <a href="http://liuxinglong.github.io/Blog/">Back to menu</a>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </section><!-- /.about-section -->    

                        <section id="contact-section" class="inactive">
                            <div class="row">
                                <div class="black-bg col-sm-12 col-md-12 col-lg-12">
                                    <h2 class="text-center">Contact Us</h2>
                                    
                                    <div class="col-sm-12 col-md-12">
                                        <p><a href="#"></a></p>
                                    </div>
                                    
                                    <div class="col-sm-6 col-md-6">
                                        <div id="map-canvas"></div>
                                        <p></p>
                                    </div>

                                    <div class="col-sm-6 col-md-6 margin-bottom-20">
                                        <form action="#" method="post">

                                                <div class="form-group">
                                                    <!--<label for="contact_name">Name</label>-->
                                                    <input type="text" id="contact_name" class="form-control" placeholder="Name" />
                                                </div>
                                                <div class="form-group">
                                                    <!--<label for="contact_email">Email Address</label>-->
                                                    <input type="text" id="contact_email" class="form-control" placeholder="Email Address" />
                                                </div>
                                                <div class="form-group">
                                                    <!--<label for="contact_message">Message</label>-->
                                                    <textarea id="contact_message" class="form-control" rows="7" placeholder="Write a message"></textarea>
                                                </div>
                                                <button type="submit" class="btn btn-primary">Send</button>

                                        </form>
                                    </div>
                                    
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="row margin-top-20">
                                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  pull-right">
                                    <a href="#menu" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <a href="http://liuxinglong.github.io/Blog/">Back to menu</a> 
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </section><!-- /.contact-section -->    

                        <section id="company-intro-section" class="inactive">
                            <div class="row">
                                <div class="black-bg col-sm-12 col-md-12 col-lg-12">
                                    <h2 class="text-center">Company Intro</h2>
                                    <div class="col-sm-12 col-md-12">
                                        <p></p>
                                        <p><a href="#"></a> </p>
                                        <p></p>
                                    </div>
                                </div>
                            </div>
                            <div class="row margin-top-20">
                                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  pull-right">
                                    <a href="#menu" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <a href="http://liuxinglong.github.io/Blog/">Back to menu</a>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </section><!-- /.company-intor-section -->  
						
                        <section id="testimonials-section" class="inactive">
                            <div class="row">
                                <div class="black-bg col-sm-12 col-md-12 col-lg-12">
                                    
                                    <h2 class="text-center">Testimonials and Awards</h2>
                                    <div class="col-sm-12 col-md-12">
                                        <p></p>
                                        <p></p>
                                    </div>

                                </div>
                            </div>
                            <div class="row margin-top-20">
                                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6  pull-right">
                                    <a href="#menu" class="change-section">
                                        <div class="black-bg btn-menu">
                                            <a href="http://liuxinglong.github.io/Blog/">Back to menu</a>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </section><!-- /.company-intor-section -->    

                        
                    </div><!-- /.templatemo-content -->  
                </div><!-- /.templatemo-content-wrapper --> 
            </div><!-- /.row --> 

           
		</div><!-- /#main-wrapper -->
        
        <div id="preloader">
            <div id="status">&nbsp;</div>
        </div><!-- /#preloader -->
        
        <script src="js/jquery.min.js"></script>
        <script src="js/jquery-ui.min.js"></script>
        <script src="js/jquery.backstretch.min.js"></script>
        <script src="js/templatemo_script.js"></script>

    </body> 
</html>
